<template>
  <div>
    <el-contailner>
      <el-aside width="220px">
        <el-menu router default-active="1" :router="true" background-color="#545c64" text-color="#fff" active-text-color="#ffee">
          <el-menu-item index="1" :route="{path:'/HelloWord'}" style="text-align: center">实时监控</el-menu-item>
          <el-submenu index="/HelloWord">
            <template slot="title">
              <span>资源管理</span>
            </template>
            <el-menu-item index="1-2">测试环境配置</el-menu-item>
            <el-menu-item index="1-3">数据库配置</el-menu-item>
          </el-submenu>
          <el-submenu index="2">
            <template slot="title">
              <span>接口管理</span>
            </template>
            <el-menu-item index="11">接口用例</el-menu-item>
            <el-menu-item index="22">历史记录</el-menu-item>
            <el-menu-item index="112">批次查询</el-menu-item>
            <el-menu-item index="231">定时任务</el-menu-item>
          </el-submenu>
          <!--      <el-submenu index="3">
                  <template slot="title">
                    <i class="el-icon-menu"></i>
                    <span>项目管理</span>
                  </template>
                </el-submenu>-->
          <el-submenu index="4">
            <template slot="title">
              <span>系统管理</span>
            </template>
            <el-menu-item index="44">用户管理</el-menu-item>
            <el-menu-item index="444">组织管理</el-menu-item>
          </el-submenu>
        </el-menu>
        <router-view></router-view>

      </el-aside>
      <el-main>
        <router-view></router-view>
      </el-main>
    </el-contailner>
  </div>
</template>

<style scoped>
  .el-aside {
    background-color: #545c64;
    color: #333;
    text-align: center;
    line-height: 200px;
  }
  .el-menu{
    border-right-width: 0px;
    text-align: center;
  }
  .el-menu-item{
    text-align: right;
  }
</style>

<script>


</script>
